{extend name="public:head"}
{block name="main"}

<form class="layui-form" style="margin: 20px">
    <div class="demoTable">
        条件搜索：

        <div class="layui-input-inline">
            <input name="time" type="text" class="layui-input"  placeholder="输入时间范围">
        </div>

        <div class="layui-inline">
            <button class="layui-btn" lay-filter="submit" lay-submit>搜索</button>
            <button class="layui-btn layui-btn-primary"  lay-filter="submit" lay-submit>重置</button>
        </div>

    </div>
</form>

<table  class="layui-hide" id="all" lay-filter="all" lay-data="{id: 'sousuo'}"></table>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">删除选中行数据</button>
        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
    </div>
</script>

<script>
    layui.use(['table','layer','form'], function(){
        console.log('hello layui');
        var form = layui.form;
        var tokenValue = layui.data('cache');
        var table = layui.table;
        var layer = layui.layer;
        table.render({
            elem: '#all'
            ,url:'/login/Preview/previewPage'
            ,toolbar: '#toolbarDemo'
            ,headers: {token: tokenValue.token}
            ,data:{
                "type": "identification"
            }
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'from', title:'推广方'}
                ,{field:'sign', title:'标识码'}
                ,{field:'ip', title:'来源ip'}
                ,{field:'address', title:'来源地区'}
                ,{field:'add_time', title:'添加时间'}
                ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150 , align: 'center'}
            ]]
            ,page: true
        });
        // 表格重载 用于搜索
        form.on('submit(submit)', function(data){
            var field=data.field;
            if($(data.elem).html()=="重置"){
                $("input").val("");
                field="";
                location.reload();
            }
            table.reload('all', {
                url: '/login/Show/byCondition',
                where: {field}
            });
            return false;
        });

        table.on('tool(all)', function(obj){
            var data = obj.data; //获得当前行数据
            var id = obj.data.id
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            // json = JSON.stringify(obj.data)
            var token = layui.data('cache') // 获取缓存中的token
            // console.log(json);
            if(obj.event == 'del'){
                layer.confirm('真的删除行么', function(index){
                    layer.close(index);
                    var arr = Array()
                    arr[0] = obj.data
                    var jsonData = JSON.stringify(arr);
                    //向服务端发送删除指令
                    $.post({
                        url:"/login/Del/delOnePopularize",
                        type:"post",
                        headers:{"token":token.token},
                        dataType:"json",
                        data:{'data':jsonData},
                        success:function (res) {
                            if(res.code == 400){
                                console.log(res.code)
                                console.log('success')
                                layer.msg('删除失败！！！请重试');
                            }
                            if(res.code == 200){
                                layer.msg('删除成功！！！');
                                obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                            }
                        },
                        error:function (error) {
                            if(error.code == 500){
                                layer.msg('删除失败！！！权限不够');
                            }
                        }
                    })
                });
            }
        });

        table.on('toolbar(all)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            var token = layui.data('cache')
            switch(obj.event){
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.confirm('真的删除行么<br>'+JSON.stringify(data), function(index){
                        layer.close(index);
                        var jsonData = JSON.stringify(data);
                        //向服务端发送删除指令
                        $.post({
                            url:"/login/Del/delOnePopularize",
                            type:"post",
                            headers:{"token":token.token},
                            dataType:"json",
                            data:{'data':jsonData},
                            success:function (res) {
                                if(res.code == 400){
                                    console.log(res.code)
                                    console.log('success')
                                    layer.msg('删除失败！！！请重试');
                                }
                                if(res.code == 200){
                                    layer.msg('删除成功！！！');
                                    location.reload();  //删除对应行（tr）的DOM结构，并更新缓存
                                }
                            },
                            error:function (error) {
                                if(error.code == 500){
                                    layer.msg('删除失败！！！权限不够');
                                }
                            }
                        })
                    });
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：'+ data.length + ' 个');
                    break;
            };
        });

    });
</script>

{/block}